.dhz {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Ensure the main content area scrolls and leaves space for the Tabbar */
.dhz main {
    flex: 1;
    overflow-y: auto;
    padding-bottom: 84px; /* avoid bottom content being covered by Tabbar */
}

:global {
    .adm-tab-bar-wrap {
        margin-top: 13px;
        margin-left: 8px;
        height: 74px;
    }
    
    /* 修改tabbar激活状态的颜色 - 使用react-vant的实际类名 */
    .rv-tabbar-item--active .rv-tabbar-item__text {
        color: #34C759 !important;
    }
    
    .rv-tabbar-item--active .rv-tabbar-item__icon {
        color: #34C759 !important;
    }
    
    /* 确保图标颜色在激活状态下为绿色 */
    .rv-tabbar-item--active svg {
        color: #34C759 !important;
        fill: #34C759 !important;
    }
    
    /* 针对antd-mobile图标的特殊处理 */
    .rv-tabbar-item--active .anticon {
        color: #34C759 !important;
    }
    
    /* 备用样式 - 如果react-vant使用不同的类名 */
    .rv-tabbar-item.rv-tabbar-item--active .rv-tabbar-item__text {
        color: #34C759 !important;
    }
    
    .rv-tabbar-item.rv-tabbar-item--active .rv-tabbar-item__icon {
        color: #34C759 !important;
    }
    
    /* 图片图标的颜色变化效果 */
    .rv-tabbar-item--active .rv-tabbar-item__icon img {
        filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%) !important;
    }
    
    /* 针对第一个tabbar项（春雨图标）的特殊处理 */
    .rv-tabbar-item:first-child.rv-tabbar-item--active .rv-tabbar-item__icon img {
        filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%) !important;
    }
    
    /* 如果react-vant使用不同的类名结构 */
    .rv-tabbar-item--active img {
        filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%) !important;
    }
}